<template>
	<view class="home-navigator">
		<view @click="goNavigate(item)" hover-class="navigator-hover" class="list-item" v-for="(item,index) in list"
			:key="index">

			<image :src="item.pic" mode="" :class="{disabled:item.disabled}"></image>
			<view class="label">
				{{item.label}}
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list: [{
						label: '便民服务',
						pic: '../../static/images/newIcon/new/bianminfuwu.png',
						navigateTo: '/activity/service/service',
					},
					{
						label: '意见反馈',
						// disabled: true,
						pic: '../../static/images/newIcon/new/yijianfankui.png',
						navigateTo: '/ticketSystem/homeFeedBack/homeFeedBack',
					},

					{
						label: '社区调查',
						// disabled: true,
						pic: '../../static/images/newIcon/new/x.png',
						navigateTo: '/activity/questionnaireList/questionnaireList',
					},
					{
						label: '社区投票',
						pic: '../../static/images/newIcon/new/w.png',
						navigateTo: '/activity/voteList/voteList',
					},
					{
						label: '访客预约',
						pic: '../../static/images/newIcon/new/fangkeyuyue.png',
						navigateTo: '/visitor/index/index'
					},
					{
						label: '垃圾分类',
						pic: '../../static/images/newIcon/new/lajifenlei.png',
						navigateTo: '/garbage/index/index'
					},
					{
						label: '积分明细',
						pic: '../../static/images/newIcon/new/z.png',
						navigateTo: '/pages/pointDetail/pointDetail'
					},
					{
						label: '更多',
						pic: '../../static/images/newIcon/new/gengduo.png',
						navigateTo: '/pages/more/more',
					},








				]
				// list: [{
				// 		label: '小区简介',
				// 		pic: '../../static/images/newIcon/xiaoqujianjie.png',
				// 		navigateTo: '/party/projInfo/projInfo',
				// 	},
				// 	{
				// 		label: '红临E家',
				// 		// label: '小区党建',
				// 		pic: '../../static/images/newIcon/xiaoqudangjian.png',
				// 		navigateTo: '/party/index/index',
				// 	}, {
				// 		label: '一键解难',
				// 		pic: '../../static/images/newIcon/yijianjienan.png',
				// 		navigateTo: '/ticketSystem/index/index'
				// 	}, {
				// 		label: '网格巡检',
				// 		pic: '../../static/images/newIcon/wangluoyunjian.png',
				// 		navigateTo: '/pages/underConstruction/underConstruction',
				// 	}, {
				// 		label: '便民服务',
				// 		pic: '../../static/images/newIcon/bianminfuwu.png',
				// 		navigateTo: '/pages/underConstruction/underConstruction',
				// 	},
				// 	{
				// 		label: '物业缴费',
				// 		pic: '../../static/images/newIcon/wuyejiaofei.png',
				// 		navigateTo: '/pages/underConstruction/underConstruction',
				// 	},
				// 	{
				// 		label: '智慧停车',
				// 		pic: '../../static/images/newIcon/zhihuitingche.png',
				// 		navigateTo: '/pages/underConstruction/underConstruction'
				// 	},
				// 	{
				// 		label: '访客预约',
				// 		pic: '../../static/images/newIcon/fangkeyuyue.png',
				// 		navigateTo: '/visitor/index/index'
				// 	},
				// 	{
				// 		label: '垃圾分类',
				// 		pic: '../../static/images/newIcon/lajifenlei.png',
				// 		navigateTo: '/garbage/index/index'
				// 	},
				// 	{
				// 		label: '更多功能',
				// 		pic: '../../static/images/newIcon/gengduo.png',
				// 		navigateTo: '/pages/more/more',
				// 	},


				// ]
			}
		},
		methods: {
			goNavigate(item) {
				if (item.disabled) {
					return
				}
				if (!uni.getStorageSync('userInfo')) {
					uni.showModal({
						title: '您还未登陆,请先登陆后使用',
						success: res => {
							if (res.confirm) {
								uni.navigateTo({
									url: '../login/login'
								})
							}
						}
					})
					return
				}
				if (uni.getStorageSync('userInfo').checkStatus != 2) {
					uni.showModal({
						title: '您的审批暂未通过，无法使用此功能'
					})
				} else {
					uni.navigateTo({
						url: item.navigateTo
					})
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	.home-navigator {
		display: grid;
		grid-template-columns: repeat(4, 25%);
		padding: 28rpx 0;
		grid-row-gap: 32rpx;
		font-size: 24rpx;
		color: #333333;

		margin: 15rpx 25rpx;
		box-shadow: 2rpx 2rpx 16rpx #D3D3D3;
		border-radius: 12rpx;

		.list-item {
			text-align: center;

			image {
				width: 82rpx;
				height: 71rpx;
				margin-bottom: 10rpx;
			
			}

			image.disabled {
				filter: grayscale(100%);
			}
		}
	}
</style>
